/**********************************************************
	GENERAL UI ELEMENTS
**********************************************************/

* {
	-webkit-user-select:none; /* Prevent copy paste for all elements except text fields */
	-webkit-tap-highlight-color:rgba(255, 255, 255, 0); /* set highlight color for user interaction */
	margin:0;
	padding:0;/* Remove default padding and margins for all elements */
	-webkit-box-sizing:border-box; box-sizing:border-box;
} 

input,textarea { -webkit-user-select:text; } /* allow users to select text that appears in input fields */

img { border:none; } /* Remove default borders for images */

body {
	overflow-x:hidden;
	-webkit-text-size-adjust:none;
	font:normal 14px/18px Helvetica, Arial, sans-serif;
	color:#232332;
	background:#fff; /* primary background color */
	display:-webkit-box; /* We want to layout our first container vertically */
    -webkit-box-orient:vertical; /* we want our child elements to stretch to fit the container */
	-webkit-box-align:stretch;
} /* General styles that apply to elements not contained within other classes and styles */

p {
	font:normal 14px/18px Arial, Helvetica, sans-serif;
	color:#232332;
	background:transparent;
	padding:16px;
} /* Paragraph class used for text areas. */


#jQui_modal{
    -webkit-transform:translate3d(100%,0,0);
    -webkit-backface-visibility:hidden;
	z-index:9999 !important;
	width:100%;	height:100%;
	display:none;
	position:absolute; top:0px; left:-100%;
	overflow:hidden;
	background:rgba(255,255,255,1) !important;
	box-shadow:0px 0px 12px rgba(0,0,0,.6);
	-webkit-perspective:1000;
}

#modalContainer {
width:100%;
}


.horzRule {
	position:relative;
	display:block;
	background:#999;
	width:100%;	height:1px;
} /* Horizontal line. */

.jqmScrollbar { background:#333 !important; } /* Sets the color of the scrollbar */

#jQUi {
	position:absolute;
	width:100%;
	top:0px;
	bottom:0px;
}

#jQUi > #splashscreen {
	position:absolute;
	top:0px;bottom:0px;
	width:100%; min-height:100%;
	left:0px;
	background:#fff !important;
	color:#232332 !important;
	font-size:30px;
	text-align:center;
	z-index:9999;
	display:block;
	margin-left:auto !important; margin-right:auto !important;
	padding-top:80px !important;
}


/**********************************************************
	header
**********************************************************/
#jQUi > #header {
	display:block;
	z-index:250;
	-webkit-box-sizing:border-box; box-sizing:border-box;
	height:48px;
    left:0px;right:0px;
	background-image:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#e2edf3));
	-webkit-box-shadow:0px 0px 24px rgba(0,0,0,0.8); box-shadow:0px 0px 24px rgba(0,0,0,0.8);
} /* This is masthead bar that appears at the top of the UI */

#header > h1 {
	position:absolute;
	overflow:hidden;
	width:100%;
    z-index:-11;
    left:-10px;
    text-align:center;
	height:48px; 
	font:bold 24px/44px Helvetica, Arial, sans-serif;
	text-shadow:rgba(255,255,255,1) 0px 1px 0px;
	text-align:center;
	text-overflow:ellipsis;
	white-space:nowrap;
	color:#232332;
} /* This is text that appears in the header at the top of the screen */

body[orient="landscape"] > #header > h1 {
	margin-left:-125px;
	width:250px;
} /* Updates the available text area and positioning when the screen is held in landscape orientation. */



/**********************************************************
	BUTTON STYLES
**********************************************************/
#backButton {
	display:block;
	position:absolute;
	left:0px;
	top:0px;
	max-width:60px;
	text-overflow:ellipsis;
} /* Sets up positioning of the back button which appears in the header */

#backButton > div {
	max-width:60px;
	overflow:hidden;
	text-overflow:ellipsis;
} /* sets up sizing and handling of excess text for the type in the back button */

.button {
	position:relative;
	display:inline-block;
	height:36px; min-width:60px;
	cursor:pointer;
	font:bold 14px/34px Helvetica, Arial, sans-serif;
	color:#232332;
	text-decoration:none;
	text-align:center;
	text-shadow:0px 1px 0px #fff;
	padding:0px 8px;
	border:1px solid rgba(35,35,50,.4);
	margin-top:6px; margin-left:6px; 
	text-overflow:ellipsis; 
	-webkit-border-radius:6px; border-radius:6px;
	background-color:#fff;
	background-image:-webkit-gradient(linear, left top, left bottom, color-stop(.5,#fff), color-stop(.5,#e2edf3), color-stop(1,#fff));
} /* Styling for CSS-generated buttons, including the back button. These buttons can bue used anywhere in the UI. */

.button.pressed {
	color:#fff;
	background-color:#232332;
} /* behavior of button for touch interaction */

.modalbutton {
	position:absolute;
	top:0px;
	right:5px;
	height:32px;
	width:58px;
	line-height:32px;
	z-index:9999;
} 


/**********************************************************
	CONTENT AREA
**********************************************************/
#content {
	z-index:180;
	display:block;
	position:absolute;
	top:48px;
	bottom:62px;
    left:0px;right:0px;
	overflow:hidden;
} /* Accounts for positioning of the content area, which is everything below the header and above the navbar. */

.panel {
    -webkit-backface-visibility:hidden;
	z-index:180;
	width:100%;
	height:100%;
	display:none;
	position:absolute; top:0px; left:-100%;
	overflow:hidden;
	background:transparent;
	-webkit-transform:translate3d(0,0,0);
	-webkit-perspective:1000;
} /* This class is applied to the divs that contain the various "views" or pages of the app. */

.panel > * {
	-webkit-backface-visibility:hidden;
	-webkit-perspective:1000;
}


/**********************************************************
	TOOL BAR
**********************************************************/
/* Tool bar appears locked to the bottom of the screen. It is the primary navigation. can contain text or graphical navigation */
#navbar {
	position:absolute;
	bottom:0px;
	z-index:1000;
	text-align:center;
	left:0px;right:0px;
	height:62px; padding:0px 1px;
	background-image:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#e2edf3));
	-webkit-box-shadow:0px 0px 24px rgba(0,0,0,0.8); box-shadow:0px 0px 24px rgba(0,0,0,0.8);
}

#navbar a {
	position:relative;
	width:62px; height:62px;
	overflow:hidden;
	display:inline-block;
	font:bold 12px/100px Helvetica, Arial, sans-serif;
	text-decoration:none;
	color:#232332;
	text-align:center;
	margin:0px auto;
}

#navbar a:active, #navbar a:focus, #navbar a:active:focus, #navbar .selected {
	background-color:#e2edf3;
	-webkit-box-shadow:inset 0px 0px 5px rgba(0,0,0,.6); box-shadow:inset 0px 0px 5px rgba(0,0,0,.6);
}

#navbar .icon:before {
    line-height:62px;
    text-align:center;
    position:absolute;
    top:-10px;
    left:10px;
    font-size:48px;
}

.jq-badge {
	display:-webkit-box;
	-webkit-box-direction:reverse; 
	position:absolute;
	font-size:10px;
	border:2px solid white;
	color:white;
	background:red;
	line-height:12px;
	border-radius:10px;
	overflow:hidden;
	text-overflow:ellipsis;
	min-width:20px;
	max-width:90%;
	height:20px;
	margin:2px;
	padding:1px 4px 1px 4px;
	top:2px;
	right:2px;
	text-align:center;
	z-index:100;
}

.jq-badge.br {
	bottom:2px;
	right:2px;
	top:auto;
	left:auto;
}

.jq-badge.bl {
	-webkit-box-direction:normal !important;
	bottom:2px;
	left:2px;
	top:auto;
	right:auto;
}

.jq-badge.tl {
	-webkit-box-direction:normal !important;
	top:2px;
	left:2px;
	right:auto;
	bottom:auto;
}

.closebutton {
	background:url('images/frosty/close.png');
	height:23px !important;
	width:23px !important;
}

/* Custom footers - always hidden */
#jQUi footer { display:none; }
/* side menu - always hidden */
#jQUi nav { display:none; }

#jQUi > #menu {
	z-index:200;
	width:200px;
	bottom:0px;
	height:100%;
	display:none;
	position:absolute; top:0px; left:-200px;
	background:#232332;
	-webkit-transform:translate3d(0,0,0);
    -webkit-transition: all 300ms !important;
}

#menu_scroller {
	padding-bottom:10px;
}

#menu > * {
	width:90%;
	margin-left:auto;
	margin-right:auto;
}

.jqMenuHeader {
	position:relative;
	text-align:center;
	margin-top:2px;
	font-size:24px;
	margin-left:auto;margin-right:auto;
	font-weight:bold;
	margin-bottom:3px; 
	z-index:1;
}

.jqMenuClose {
	position:absolute;
	top:5px;
	right:10px;
	z-index:2;
}

#menu .title {
	font-size:16px;
	color:#fff;
	margin-bottom:3px; 
	margin-top:12px;
	font-weight:bold;
}

#menu ul {
	margin:0px; 
	padding:0px;
	margin-bottom:5px;
}
 
#menu ul > li {
	padding-left:10px;
	display:block;
	width:100%; height:28px;
	list-style:none;
	background:inherit;
} /* A plain, non-interactive list item--best suited to a heading. */

#menu ul > li > a {
	display:block;
	width:100%; height:28px;
	font:normal 14px/26px Helvetica, Arial, sans-serif;
	color:#232332;
	text-decoration:none;
	border-top:1px solid rgba(255,255,255,.4);
	background:#999;
} 

#menu ul > li > a:after { content:""; }
#menu ul > li:last-child > a { border-bottom:1px solid #232332; }
/* End side menu css */

.splashscreen {
	background:rgba(255,255,255,1) !important;
	padding-left:40px;
	padding-top:30px !important;
	min-height:100%;
}

/**********************************************************
	UL > LI 
**********************************************************/
/* A touchable, interactive list item. */
/* The unordered list/list item classes are the basis of the secondary navigation used in JQ.Mobi:the stacked, listed menu system. */

ul {
	margin:0px;
	padding:0px;
}
 
ul > li {
	display:block;
	width:100%; height:48px;
	list-style:none;
	background:#e2edf3;
} /* A plain, non-interactive list item--best suited to a heading. */

ul > li > a {
	display:block;
	width:100%; height:48px;
	font:bold 18px/48px Helvetica, Arial, sans-serif;
	text-decoration:none;
	border-top:1px solid rgba(255,255,255,.8);
	border-bottom:1px solid rgba(35,35,50,.4);
	color:#232332;
	padding-left:8px;
	padding-right:-80px;
} /* A touchable, interactive list item. */

ul > li > a:after {
	content:">";
	position:absolute;
	right:15px;
}

ul > li > a[selected], ul > li > a:active { 
	color:#fff !important;
	background:#232332;
} /* A selected and active states for interactive list items. */

ul > li.group {
	position:relative;
	top:-1px;
	margin-bottom:-2px;
	border-top:1px solid #7d7d7d;
	border-bottom:1px solid #232332;
	padding:1px 10px;
	background-image:-webkit-gradient(linear, left bottom, left top, color-stop(0.09, rgb(125,125,125)), color-stop(0.49, rgb(153,153,153)), color-stop(0.81, rgb(153,153,153)));
	font-size:17px;
	font-weight:bold;
	color:#fff;
}

ul > li.group:first-child { top:0; }

h2 {
	display:block;
	width:100%; height:48px;
	font:bold 18px/48px Helvetica, Arial, sans-serif;
	color:#fff;
	margin-bottom:1px;
	padding:0px 8px 0px 8px;
	background:#232332;
} /* Header class used for non-navigable header bars (h1 is reserved for the header) */

.collapsed:after{content:url("images/frosty/collapse.png");position:absolute;top:5px;right:5px;}
.expanded:after{content:url("images/frosty/expand.png");position:absolute;top:5px;right:5px;}



/**********************************************************
	UI
**********************************************************/	
.ui-icon {
	background:#666;
	background:rgba(0,0,0,.4);
	background-repeat:no-repeat;
	border-radius:9px;
}

.ui-loader { display: none; position: absolute; opacity: .85; z-index: 100; left: 50%; width: 200px; margin-left: -100px; margin-top: -35px; padding: 10px 30px; background: #666;background:rgba(0,0,0,.4);border-radius:9px;}

.ui-loader h1 { 
	font-size:15px;
	text-align:center;
}

.ui-loader .ui-icon {
	position:static;
	display:block;
	opacity:.9;
	margin:0 auto;
	width:35px;
	height:35px;
	background-color:transparent;
}

.spin  {
	-webkit-transform:rotate(360deg);
	-webkit-animation-name:spin;
	-webkit-animation-duration:1s;
	-webkit-animation-iteration-count: infinite;
}
@-webkit-keyframes spin {
	from {-webkit-transform:rotate(0deg);}
  	to {-webkit-transform:rotate(360deg);}
}

.ui-icon-loading {
	background-image:url('images/frosty/ajax-loader.png');
	width:40px;
	height:40px;
	border-radius:20px;
	background-size:35px 35px;
}
	
.ui-corner-all { border-radius:.6em; }

#jQui_mask { position:absolute; top:45%; }


/**********************************************************
	FORM ELEMENTS
**********************************************************/
fieldset h4 {
	text-align:left;
	font:bold 15px/21px Helvetica, Arial, sans-serif;
	color:#232332;
	margin-bottom:-8px; margin-top:8px;
} /* Style for subhead for a group of labels/inputs within a fieldset. */

fieldset {
	margin:12px 8px;
	padding:12px 18px;
	-webkit-border-radius:5px;
	border-radius:5px;
	border:1px solid #595d61;
	outline:0;
	width:95%;
} /* Styles the border line, background image and spacing for fieldsets. */

fieldset p {
	display:block;
	position:relative;
	height:37px !important;
	overflow:hidden;
	padding:8px 0px;
	font:normal 14px/10px Helvetica, Arial, sans-serif;
	background:transparent;
	-webkit-box-shadow:none;
} /* The paragraph within a fieldset is used as a wrapper to help manage the replacement of native input elements. */

legend {
	margin:0;
	font:bold 18px/24px Helvetica, Arial, sans-serif;
	overflow:hidden;
	color:#232332;
	text-transform:uppercase;
} /* This is the name that appears at the top left of the fieldset. */

textarea.jq-ui-forms { 
	display:block;
	margin-top:4px; margin-bottom:18px;
	padding:8px;
	border:solid 1px #999;
	outline:0;
	font:normal 1em/1.5em Helvetica, Arial, sans-serif;
	color:#232332;
	background:#fff;
	-webkit-border-radius:6px; border-radius:6px;
	-webkit-box-shadow:inset 2px 2px 6px rgba(0,0,0,.5); box-shadow:inset 2px 2px 6px rgba(0,0,0,.5);
	width:85%;
	min-height:150px;
} /* These properties determine the look of textarea inputs. */

input.jq-ui-forms { 
	display:inline-block;
	width:65%;
	margin-top:4px; margin-bottom:12px;
	padding:8px;
	border:solid 1px #999;
	outline:0;
	font:normal 1em/1.5em Helvetica, Arial, sans-serif;
	color:#232332;
	background:#fff;
	-webkit-border-radius:6px; border-radius:6px;
	-webkit-box-shadow:inset 2px 2px 6px rgba(0,0,0,.5); box-shadow:inset 2px 2px 6px rgba(0,0,0,.5);
} /* These properties combine to create the look of the input fields. */

input.jq-ui-forms:hover, textarea.jq-ui-forms:hover, input.jq-ui-forms:focus, textarea.jq-ui-forms:focus { border-color:#232332; } /* Changes the border color of the input field while active. */

input.jq-ui-forms[type=checkbox], input.jq-ui-forms[type=radio]  {
	position:absolute;
    left:0;
	-webkit-appearance:none;
	opacity:0;
	margin-bottom:30px;
} /* Blocks rendering of the native radio controls. */

input.jq-ui-forms[type=checkbox] + label,input.jq-ui-forms[type=radio] + label { 
	float:left;
	font-size:15px;
	font-weight:bold;
	line-height:26px; /* changing this value will change the vertical relationship to the radios & checkboxes. */
	margin-left:10px;
	padding-left:30px;
	background:url('images/frosty/custom_inputs.png') 0 0px no-repeat;
	background-repeat:none;
	height:25px;
} /* Styling for the labels. */

/* Following block of paragraph classes sets up the usage of the custom radio and checkbox graphics. */
input.jq-ui-forms[type=radio] + label { background-position:0 -225px; }
input.jq-ui-forms[type=checkbox] + label { background-position:0 -25px; }

/* Styles for "checked." */
input.jq-ui-forms[type=radio]:checked + label { background-position:0 -300px; }
input.jq-ui-forms[type=radio]:hover:checked + label,
input.jq-ui-forms[type=radio]:focus:checked + label,
input.jq-ui-forms[type=radio]:checked + label:hover,
input.jq-ui-forms[type=radio]:focus:checked + label { background-position:0 -300px; }

input.jq-ui-forms[type=checkbox]:checked + label { background-position:0 -100px; }
input.jq-ui-forms[type=checkbox]:hover:checked + label,
input.jq-ui-forms[type=checkbox]:focus:checked + label,
input.jq-ui-forms[type=checkbox]:checked + label:hover,
input.jq-ui-forms[type=checkbox]:focus:checked + label { background-position:0 -100px; }

/* Styles for "hover/focus." */
input.jq-ui-forms[type=checkbox]:hover + label,
input.jq-ui-forms[type=checkbox]:focus + label,
input.jq-ui-forms[type=checkbox] + label:hover { background-position:0 -0x; }

input.jq-ui-forms[type=radio]:hover + label,
input.jq-ui-forms[type=radio]:focus + label,
input.jq-ui-forms[type=radio] + label:hover { background-position:0 -200px; }

/* Styles for "active." */
input.jq-ui-forms[type=checkbox]:active + label,
input.jq-ui-forms[type=checkbox] + label:hover:active { background-position:0 -0px; }

input.jq-ui-forms[type=radio]:active + label,
input.jq-ui-forms[type=radio] + label:hover:active { background-position:0 -200px; }

input.jq-ui-forms[type=checkbox]:active:checked + label,
input.jq-ui-forms[type=checkbox]:checked + label:hover:active { background-position:0 -100px; }

input.jq-ui-forms[type=radio]:active:checked + label,
input.jq-ui-forms[type=radio]:checked + label:hover:active { background-position:0 -300px; }

/* Styles for "disabled." */
input.jq-ui-forms[type=checkbox]:disabled + label,
input.jq-ui-forms[type=checkbox]:hover:disabled + label,
input.jq-ui-forms[type=checkbox]:focus:disabled + label,
input.jq-ui-forms[type=checkbox]:disabled + label:hover,
input.jq-ui-forms[type=checkbox]:disabled + label:hover:active { background-position:0 -175px; opacity:.5 !important; }

input.jq-ui-forms[type=radio]:disabled + label,
input.jq-ui-forms[type=radio]:hover:disabled + label,
input.jq-ui-forms[type=radio]:focus:disabled + label,
input.jq-ui-forms[type=radio]:disabled + label:hover,
input.jq-ui-forms[type=radio]:disabled + label:hover:active { background-position:0 -250px; opacity:.5 !important; }

input.jq-ui-forms[type=checkbox]:disabled:checked + label,
input.jq-ui-forms[type=checkbox]:hover:disabled:checked + label,
input.jq-ui-forms[type=checkbox]:focus:disabled:checked + label,
input.jq-ui-forms[type=checkbox]:disabled:checked + label:hover,
input.jq-ui-forms[type=checkbox]:disabled:checked + label:hover:active { background-position:0 -200px; opacity:.5 !important; }

input.jq-ui-forms[type=radio]:disabled:checked + label,
input.jq-ui-forms[type=radio]:hover:disabled:checked + label,
input.jq-ui-forms[type=radio]:focus:disabled:checked + label,
input.jq-ui-forms[type=radio]:disabled:checked + label:hover,
input.jq-ui-forms[type=radio]:disabled:checked + label:hover:active { background-position:0 -375px; opacity:.5 !important; }


/********    slider controls */
input.jq-ui-slider {
	position:absolute;
	left:0;
	opacity:0;
	-webkit-appearance:none;
} /* Blocks rendering of the native radio controls. */

	
input.jq-ui-slider + label { 
	float:left;
	font-size:15px;
	font-weight:normal;
	line-height:24px; /* changing this value will change the vertical relationship to the radios & checkboxes. */
	margin-left:10px;
	padding-left:57px;
	color:#fff; 
	background:url('images/Off-On_Slider.png') 0 0px no-repeat;
	height:24px;
	width:57px;
	display:inline-block;
   -webkit-transition:all 0.3s  ease-in-out;
} 

input.jq-ui-forms[type=radio]:active:checked + label,
input.jq-ui-forms[type=checkbox]:active:checked + label,
input.jq-ui-forms[type=radio]:active + label,
input.jq-ui-forms[type=checkbox]:active + label,
input.jq-ui-slider[type=checkbox]:checked + label ,
input.jq-ui-slider[type=radio]:checked + label 
{ background-position:-28px 0px; }

input.jq-ui-slider[type=radio]:disabled:checked + label,
input.jq-ui-slider[type=radio]:focus:disabled:checked + label,
input.jq-ui-slider[type=checkbox]:disabled:checked + label,
input.jq-ui-slider[type=checkbox]:focus:disabled:checked + label
{ background-position:-28px 0px; opacity:.7 !important;}

/* Styles for "disabled." */
input.jq-ui-slider[type=checkbox]:disabled + label,
input.jq-ui-slider[type=checkbox]:focus:disabled + label,
input.jq-ui-slider[type=radio]:disabled + label,
input.jq-ui-slider[type=radio]:focus:disabled + label
{ background-position:0 0; opacity:.7 !important; }
	
select[disabled]~div { opacity:.7; }

.hasMenu{
-webkit-transition: all 300ms;
 position:absolute !important;
 left:0px !important;
}
.hasMenu.on {
  position:absolute !important;
  left:200px !important;
}
#menu.on {
left:0px !important;
}

#badgetablet{
	display:none !important;
}

@media handheld, only screen and (min-width: 768px){
	.hasMenu, .hasMenu.on  {
		position:absolute !important;
		left:256px !important;
        -webkit-transition: all 0ms !important;
	}
	#badgephone{ display:none !important; }
	#badgetablet{ display:inline-block !important; }
	.jqMenuClose { display:none !important;	}
	
	nav~#menu {
		z-index:200 !important;
		width:256px !important;
		bottom:0px !important;
		height:100% !important;
		display:block !important;
		position:absolute !important; top:0px !important; left:0px !important;
		background:rgba(29,29,28,1) !important;
		-webkit-transform:translate3d(0,0,0) !important;
	}
}

/** Below are styles for plugins */
#jq_actionsheet {
    position:absolute;
    left:0px;
    right:0px;
    padding-left:10px;
    padding-right:10px;
    padding-top:10px;
    margin:auto;
    background:black;
    float:left;
    z-index:1000;
    border-top:#fff 1px solid;
    background:rgba(71,71,71,.95);
    background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,.4)), to(rgba(255,255,255,0)), color-stop(.08,rgba(255,255,255,.1)), color-stop(.08,rgba(255,255,255,0)));
    background-image:-webkit-linear-gradient(top, rgba(255,255,255,.4) 0%, rgba(255,255,255,.1) 8%, rgba(255,255,255,0) 8%);
    box-shadow:0px -1px 2px rgba(0,0,0,.4);
}
#jq_actionsheet a {
    text-decoration:none;
    -webkit-transition:all 0.4s ease; 
     text-shadow:0px -1px rgba(0,0,0,.8);
    padding:0px .25em;
    border:1px solid rgba(0,0,0,.8);
    text-overflow:ellipsis; 
    -webkit-border-radius:.75em; border-radius:.75em;
    background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,.4)), to(rgba(255,255,255,0)), color-stop(.5,rgba(255,255,255,.1)), color-stop(.5,rgba(255,255,255,0)));
    background-image:-webkit-linear-gradient(top, rgba(255,255,255,.5) 0%, rgba(255,255,255,.2) 50%, rgba(255,255,255,0) 50%);
    -webkit-box-shadow:0px 1px 1px rgba(255,255,255,0.7); box-shadow:0px 1px 1px rgba(255,255,255,0.7);
    display:block;
    color:white;
    text-align:center;
    line-height:36px;
    font-size:20px;
    font-weight:bold;
    margin-bottom:10px;
    background-color:rgba(130,130,130,1);
}

#jq_actionsheet a.selected {
    background-color:rgba(150,150,150,1);
}

#jq_actionsheet a.cancel {
 background-color:rgba(43,43,43,1);
}

#jq_actionsheet a.cancel.selected {
    background-color:rgba(73,73,73,1);
}
#jq_actionsheet a.red {
     color:white;
     background-color:rgba(204,0,0,1);
}

#jq_actionsheet a.red.selected {
     background-color:rgba(255,0,0,1); 
}

BODY>DIV#mask{
    display:block;
    width:100%; 
    height:100%; 
    background:#000; 
    z-index: 999999; 
    position:absolute; 
    top:0; 
    left:0;
}

.jqPopup {
    display: block;
    width: 300px;
    border: solid 1px #72767b;
    -webkit-box-shadow: 0px 4px 6px #555, 0 0 20px rgba(255,255,255,0.5);
    -webkit-border-radius: 10px;
    padding: 10px;
    opacity: 1;
    -webkit-transform: scale(1);
    -webkit-transition: all 0.20s  ease-in-out;
    position: absolute;
    z-index: 1000000;
    margin-left: auto!important;
    margin-right: auto!important;
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(70,70,70,0.8)),    to(rgba(0,20,20,0.8)));
}
.jqPopup >* {
color:white;
}

.jqPopup.hidden {
    opacity: 0;
    -webkit-transform: scale(0);
    top: 50%;
    left: 50%;
    margin: 0px auto;
}

.jqPopup>HEADER{
    font-weight:bold;
    font-size:20px;    
    margin:0;
    padding:0;
}

.jqPopup>DIV{
    font-size:12px;
    margin:8px;
}

.jqPopup>FOOTER{
    width:100%;    
    text-align:center;
    display:block !important;
}

.jqPopup>FOOTER>A#cancel{
    float:left;
}

.jqPopup>FOOTER>A#action{
    float:right;
    margin-right:4px;
}

.jqPopup>FOOTER>A.center{
    float:none!important;
    width:80%;
    margin:8px;
}/** This can be your default scrollbar class.  You must use !important to override the default inline styles */
.scrollBar { 
   position:absolute !important;
   width:5px !important;
   height:20px !important;
   border-radius:2px !important;
   border:1px soldid black !important;
   background:black !important;
   opacity:0 !important;
}/*
 * Since the styles are built in, you have to override values with !important
 */

/* Row of selected item */
.jqmobiSelectRowFound {
}

/* Button (radio) for the found item in the list */
.jqmobiSelectRowButtonFound{
}


/* Row for items in the list */
.jqmobiSelectRow{

}

/* button for the items in the list */
.jqmobiSelectRowButton{

}

/* class for the item text displayed */
.jqmobiSelectRowText{
}

/* Header for select box */
#jqmobiSelectBoxHeader{
}

/* div that holds the options listed*/
#jqmobiSelectBoxFix {

}